<template>
<uni-shadow-root class="partials-near_mendain_list-type_one-index"><template name="typeOne">
<block v-if="nearMendainList">
    <scroll-view scroll-x="true" class="near_mendain_list" v-if="nearMendainList.length!=0">
        <block v-for="(item,index) in (nearMendainList)" :key="item.index" :data-link="'mendian_detail.html?mendianId='+(item.id)" @click.native="tolinkUrl">
            <view class="near_mendain_item" v-if="limitState?limitState>index:'true'">
                <view class="near_mendain_banner">
                    <image :src="item.banner" mode="aspectFill" class="near_mendain_banner_img"></image>
                </view>
                <view class="near_mendain_info">
                    <text class="near_mendain_name">{{item.name}}</text>
                    <text class="near_mendain_distance">{{item.distance}}km</text>
                </view>
            </view>
        </block>
    </scroll-view>
    <view class="noproduct" v-else>
      <image mode="widthFix" src="https://image1.sansancloud.com/xianhua/2019_12/16/15/54/55_950.jpg?x-oss-process=style/preview_120"></image>
      <text>附近暂无门店~</text>
    </view>
</block>
</template></uni-shadow-root>
</template>

<script>

global['__wxRoute'] = 'partials/near_mendain_list/type_one/index'

Component({})

export default global['__wxComponents']['partials/near_mendain_list/type_one/index']
</script>
<style platform="mp-weixin">
.near_mendain_list{
    display: flex;
    flex-direction: row;
    white-space: nowrap;
}
.near_mendain_item{
  width: 40%;
  margin-left: 16rpx;
  display: inline-flex;
  flex-direction: column;
  text-align: center;
  box-sizing: border-box;
  padding: 20rpx 0;
  overflow: hidden;
}
.near_mendain_item:last-child{
    margin-right: 16rpx;
}
.near_mendain_banner{
    width: 100%;
    height: 200rpx;
    margin-bottom: 20rpx;
    border-radius: 10rpx;
}
.near_mendain_banner_img{
    width: 100%;
    height: 100%;
    border-radius: 10rpx;
}
.near_mendain_info{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    font-size: 22rpx;
    color: #222;
}
.near_mendain_name{
    width: 74%;
    font-size: 24rpx;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

}
.near_mendain_distance{
    color: #999;
}
</style>